<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if IE 9]>    <html class="no-js ie9" lang="en"> <![endif]-->
<!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 9]><!--> <html class="no-js" lang="en" itemscope itemtype="http://schema.org/Product"> <!--<![endif]-->
<head>
  <meta charset="utf-8">

  <!-- Use the .htaccess and remove these lines to avoid edge case issues.
       More info: h5bp.com/b/378 -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  <title>Gumby - A Flexible, Responsive CSS Framework - Powered by SASS</title>
  <meta name="description" content="" />
  <meta name="keywords" content="" />
  <meta name="author" content="humans.txt">

  <link rel="shortcut icon" href="favicon.png" type="image/x-icon" />

  <!-- Facebook Metadata /-->
  <meta property="fb:page_id" content="" />
  <meta property="og:image" content="" />
  <meta property="og:description" content=""/>
  <meta property="og:title" content=""/>

  <!-- Google+ Metadata /-->
  <meta itemprop="name" content="">
  <meta itemprop="description" content="">
  <meta itemprop="image" content="">

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">

  <!-- We highly recommend you use SASS and write your custom styles in sass/_custom.scss.
       However, there is a blank style.css in the css directory should you prefer -->
  <link rel="stylesheet" href="css/gumby.css">
  <!-- <link rel="stylesheet" href="css/style.css"> -->

  <script src="js/libs/modernizr-2.6.2.min.js"></script>
</head>

<style>
  html, body {
    background: #fefefe;
  }

  .column, .columns, .tiles > li {
    background: #ddd;
        border: 1px solid #d0d0d0;
    -webkit-transition-duration: .3s;
    -moz-transition-duration: .3s;
    -o-transition-duration: .3s;
    -ms-transition-duration: .3s;
    transition-duration: .3s;
  }

  .column:hover, .columns:hover {
    background: #efefef;
    cursor: pointer;
    -webkit-transition-duration: .3s;
    -moz-transition-duration: .3s;
    -o-transition-duration: .3s;
    -ms-transition-duration: .3s;
    transition-duration: .3s;
  }

  .row {
    margin-bottom: 25px;
    text-align: center;
  }

  h1, h2 {
    font: bold italic 220px georgia, times new roman, serif;
    color: #555;
    letter-spacing: -.09em;
    -webkit-transition-duration: 1s;
  }

  h2  {
    font-size: 21px;
    font-weight: normal;
    line-height: 1.6;
  }

  p {
    font-size: 16px;
    line-height: 60px;
    margin-bottom: 0;
    color: #555;

    -webkit-transition-duration: .2s;
    -moz-transition-duration: .2s;
    -o-transition-duration: .2s;
    -ms-transition-duration: .2s;
    transition-duration: .2s;
  }

  .column:hover p, .columns:hover p {
    font-size: 25px;
    font-weight: bold;

    -webkit-transition-duration: .2s;
    -moz-transition-duration: .2s;
    -o-transition-duration: .2s;
    -ms-transition-duration: .2s;
    transition-duration: .2s;
  }

  .head, .head:hover {
    box-shadow: none;
    margin-top: 30px;
  }

  .head span {
    font-weight: bold;
    color: #353535;
  }

  .head span span {
    font-size: 32px;
    font-weight: bold !important;
  }

  a {
    color: #d04526;
  }

  a:hover {
    text-decoration:underline;
  }

  .special, .special:hover {
    background: transparent;
        border: none;
  }

  .special:hover p {
    color: #ffe400;
  }

  @media only screen and (max-width: 767px) {

    h1 {
      font: bold italic 100px georgia, times new roman, serif;
      -webkit-transition-duration: .5s;
    }

  }


</style>

<body>

  <div class="row">
    <div class="twelve columns special head">
      <h1>Gumby</h1>
      <h2>A <span>responsive <span>960</span> grid</span>
      from <a href="#">Digital Surgeons</a></h2>
    </div>
  </div>

  <div class="row">
    <div class="twelve columns">
      <p>940px</p>
    </div>
  </div>

  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="eleven columns">
      <p>860px</p>
    </div>
  </div>

  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns">
      <p>60px</p>
    </div>
  </div>

  <div class="row">
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="ten columns">
      <p>780px</p>
    </div>
  </div>

  <div class="row">
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="two columns">
      <p>140px</p>
    </div>
    <div class="two columns">
      <p>140px</p>
    </div>
  </div>

  <div class="row">
    <div class="three columns">
      <p>220px</p>
    </div>
    <div class="nine columns">
      <p>700px</p>
    </div>
  </div>

  <div class="row">
    <div class="three columns">
      <p>220px</p>
    </div>
    <div class="three columns">
      <p>220px</p>
    </div>
    <div class="three columns">
      <p>220px</p>
    </div>
    <div class="three columns">
      <p>220px</p>
    </div>
  </div>

  <div class="row">
    <div class="four columns">
      <p>300px</p>
    </div>
    <div class="eight columns">
      <p>620px</p>
    </div>
  </div>

  <div class="row">
    <div class="four columns">
      <p>300px</p>
    </div>
    <div class="four columns">
      <p>300px</p>
    </div>
    <div class="four columns">
      <p>300px</p>
    </div>
  </div>

  <div class="row">
    <div class="five columns">
      <p>380px</p>
    </div>
    <div class="seven columns">
      <p>540px</p>
    </div>
  </div>

  <div class="row">
    <div class="six columns">
      <p>460px</p>
    </div>
    <div class="six columns">
      <p>460px</p>
    </div>
  </div>

  <!-- Offset Tests -->
  <div class="row">
    <div class="twelve columns special">
      <p>Columns pushed right by 'x'</p>
    </div>
  </div>
  <div class="row">
    <div class="eleven columns push_one">
      <p>11 Columns Push 1</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="ten columns push_one">
      <p>10 Columns Push 1</p>
    </div>
  </div>
  <div class="row">
    <div class="ten columns push_two">
      <p>10 Columns Push 2</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="nine columns push_two">
      <p>9 Columns Push 2</p>
    </div>
  </div>
  <div class="row">
    <div class="nine columns push_three">
      <p>9 Columns Push 3</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="eight columns push_three">
      <p>8 Columns Push 3</p>
    </div>
  </div>
  <div class="row">
    <div class="eight columns push_four">
      <p>8 Columns Push 4</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="seven columns push_four">
      <p>7 Columns Push 4</p>
    </div>
  </div>
  <div class="row">
    <div class="seven columns push_five">
      <p>7 Columns Push 5</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="six columns push_five">
      <p>6 Columns Push 5</p>
    </div>
  </div>
  <div class="row">
    <div class="six columns push_six">
      <p>6 Columns Push 6</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="five columns push_six">
      <p>5 Columns Push 6</p>
    </div>
  </div>
  <div class="row">
    <div class="five columns push_seven">
      <p>5 Columns Push 7</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="four columns push_seven">
      <p>4 Columns Push 7</p>
    </div>
  </div>

  <div class="row">
    <div class="four columns push_eight">
      <p>4 Columns Push 8</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="three columns push_eight">
      <p>3 Col Push 8</p>
    </div>
  </div>

  <div class="row">
    <div class="three columns push_nine">
      <p>3 Col Push 9</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="two columns push_nine">
      <p>2 - Push 9</p>
    </div>
  </div>


  <div class="row">
    <div class="two columns push_ten">
      <p>2 - Push 10</p>
    </div>
  </div>
  <div class="row">
    <div class="one columns">
      <p>60px</p>
    </div>
    <div class="one columns push_ten">
      <p>60px</p>
    </div>
  </div>


  <div class="row">
    <div class="one columns push_eleven">
      <p>60px</p>
    </div>
  </div>

  <!-- Offset Tests -->
  <div class="row">
    <div class="twelve columns special">
      <p>Columns pushed and pulled by 'x'</p>
    </div>
  </div>
  <div class="row">
    <div class="one column push_eleven">
      <p>1</p>
    </div>
    <div class="eleven columns pull_one">
      <p>11 Columns Pull 1</p>
    </div>
  </div>
  <div class="row">
    <div class="two columns push_ten">
      <p>2 Columns</p>
    </div>
    <div class="ten columns pull_two">
      <p>10 Columns Pull 2</p>
    </div>
  </div>
  <div class="row">
    <div class="three columns push_nine">
      <p>3 Columns Push 9</p>
    </div>
    <div class="nine columns pull_three">
      <p>9 Columns Pull 3</p>
    </div>
  </div>
  <div class="row">
    <div class="four columns push_eight">
      <p>4 Columns Push 8</p>
    </div>
    <div class="eight columns pull_four">
      <p>8 Columns Pull 4</p>
    </div>
  </div>
  <div class="row">
    <div class="five columns push_seven">
      <p>5 Columns Push 7</p>
    </div>
    <div class="seven columns pull_five">
      <p>7 Columns Pull 5</p>
    </div>
  </div>
  <div class="row">
    <div class="six columns push_six">
      <p>6 Columns Push 6</p>
    </div>
    <div class="six columns pull_six">
      <p>6 Columns Pull 6</p>
    </div>
  </div>
  

  <!-- Centering tests -->
  <div class="row">
    <div class="twelve columns special">
      <p>Centered Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="eleven columns centered">
      <p>11 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="ten columns centered">
      <p>10 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="nine columns centered">
      <p>9 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="eight columns centered">
      <p>8 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="seven columns centered">
      <p>7 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="six columns centered">
      <p>6 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="five columns centered">
      <p>5 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="four columns centered">
      <p>4 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="three columns centered">
      <p>3 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="two columns centered">
      <p>2 Columns</p>
    </div>
  </div>

  <div class="row">
    <div class="one columns centered">
      <p>1 Col</p>
    </div>
  </div>

  <!-- Sixteen Column Grid -->
  <section class="sixteen colgrid">

    <div class="row">
      <div class="sixteen columns special">
        <p>Responsive 16 Column Grid</p>
      </div>
    </div>

    <div class="row">
      <div class="sixteen columns">
        <p>940px</p>
      </div>
    </div>

    <div class="row">
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="fifteen columns">
        <p>880px</p>
      </div>
    </div>

    <div class="row">
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
      <div class="one columns">
        <p>40</p>
      </div>
    </div>

    <div class="row">
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="fourteen columns">
        <p>820px</p>
      </div>
    </div>

    <div class="row">
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
    </div>

    <div class="row">
      <div class="three columns">
        <p>160px</p>
      </div>
      <div class="thirteen columns">
        <p>760px</p>
      </div>
    </div>

    <div class="row">
      <div class="three columns">
        <p>160px</p>
      </div>
      <div class="three columns">
        <p>160px</p>
      </div>
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="three columns">
        <p>160px</p>
      </div>
      <div class="three columns">
        <p>160px</p>
      </div>
    </div>

    <div class="row">
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="twelve columns">
        <p>700px</p>
      </div>
    </div>

    <div class="row">
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="four columns">
        <p>220px</p>
      </div>
    </div>

    <div class="row">
      <div class="five columns">
        <p>280px</p>
      </div>
      <div class="eleven columns">
        <p>640px</p>
      </div>
    </div>

    <div class="row">
      <div class="five columns">
        <p>280px</p>
      </div>
      <div class="six columns">
        <p>340px</p>
      </div>
      <div class="five columns">
        <p>280px</p>
      </div>
    </div>

    <div class="row">
      <div class="six columns">
        <p>340px</p>
      </div>
      <div class="ten columns">
        <p>580px</p>
      </div>
    </div>

    <div class="row">
      <div class="six columns">
        <p>340px</p>
      </div>
      <div class="four columns">
        <p>220px</p>
      </div>
      <div class="six columns">
        <p>340px</p>
      </div>
    </div>

    <div class="row">
      <div class="seven columns">
        <p>400px</p>
      </div>
      <div class="nine columns">
        <p>520px</p>
      </div>
    </div>

    <div class="row">
      <div class="seven columns">
        <p>400px</p>
      </div>
      <div class="two columns">
        <p>100px</p>
      </div>
      <div class="seven columns">
        <p>400px</p>
      </div>
    </div>

    <div class="row">
      <div class="eight columns">
        <p>460px</p>
      </div>
      <div class="eight columns">
        <p>460px</p>
      </div>
    </div>

    <!-- Offset Tests -->
    <div class="row">
      <div class="sixteen columns special">
        <p>Columns pushed right by 'x'</p>
      </div>
    </div>
    <div class="row">
        <div class="fifteen columns push_one">
            <p>15 Columns Push 1</p>
        </div>
    </div>
    <div class="row">
        <div class="one columns">
            <p>40px</p>
        </div>
        <div class="fourteen columns push_one">
            <p>14 Columns Push 1</p>
        </div>
    </div>
    <div class="row">
        <div class="fourteen columns push_two">
            <p>14 Columns Push 2</p>
        </div>
    </div>
    <div class="row">
        <div class="one columns">
            <p>40px</p>
        </div>
        <div class="thirteen columns push_two">
            <p>13 Columns Push 2</p>
        </div>
    </div>
    <div class="row">
        <div class="thirteen columns push_three">
            <p>13 Columns Push 3</p>
        </div>
    </div>
    <div class="row">
        <div class="one columns">
            <p>40px</p>
        </div>
        <div class="twelve columns push_three">
            <p>12 Columns Push 3</p>
        </div>
    </div>
    <div class="row">
        <div class="twelve columns push_four">
            <p>12 Columns Push 4</p>
        </div>
    </div>
    <div class="row">
        <div class="one columns">
            <p>40px</p>
        </div>
        <div class="eleven columns push_four">
            <p>11 Columns Push 4</p>
        </div>
    </div>
    <div class="row">
        <div class="eleven columns push_five">
            <p>11 Columns Push 5</p>
        </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="ten columns push_five">
        <p>10 Columns Push 5</p>
      </div>
    </div>
    <div class="row">
      <div class="ten columns push_six">
        <p>10 Columns Push 6</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="nine columns push_six">
        <p>9 Columns Push 6</p>
      </div>
    </div>
    <div class="row">
      <div class="nine columns push_seven">
        <p>9 Columns Push 7</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="eight columns push_seven">
        <p>8 Columns Push 7</p>
      </div>
    </div>
    <div class="row">
      <div class="eight columns push_eight">
        <p>8 Columns Push 8</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="seven columns push_eight">
        <p>7 Columns Push 8</p>
      </div>
    </div>
    <div class="row">
      <div class="seven columns push_nine">
        <p>7 Columns Push 9</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="six columns push_nine">
        <p>6 Columns Push 9</p>
      </div>
    </div>
    <div class="row">
      <div class="six columns push_ten">
        <p>6 Columns Push 10</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="five columns push_ten">
        <p>5 Columns Push 10</p>
      </div>
    </div>
    <div class="row">
      <div class="five columns push_eleven">
        <p>5 Columns Push 11</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="four columns push_eleven">
        <p>4 Columns Push 11</p>
      </div>
    </div>

    <div class="row">
      <div class="four columns push_twelve">
        <p>4 Columns Push 12</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="three columns push_twelve">
        <p>3 Col Push 12</p>
      </div>
    </div>

    <div class="row">
      <div class="three columns push_thirteen">
        <p>3 Col Push 13</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="two columns push_thirteen">
        <p>2 - Push 13</p>
      </div>
    </div>
    <div class="row">
      <div class="two columns push_fourteen">
        <p>2 - Push 14</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns">
        <p>40px</p>
      </div>
      <div class="one columns push_fourteen">
        <p>40px</p>
      </div>
    </div>
    <div class="row">
      <div class="one columns push_fifteen">
        <p>40px</p>
      </div>
    </div>

    <!-- Offset Tests -->
    <div class="row">
      <div class="sixteen columns special">
        <p>Columns pushed and pulled by 'x'</p>
      </div>
    </div>
    <div class="row">
      <div class="one column push_fifteen">
        <p>1</p>
      </div>
      <div class="fifteen columns pull_one">
        <p>15 Columns Pull 1</p>
      </div>
    </div>
    <div class="row">
      <div class="two columns push_fourteen">
        <p>2 Col</p>
      </div>
      <div class="fourteen columns pull_two">
        <p>14 Columns Pull 2</p>
      </div>
    </div>
    <div class="row">
      <div class="three columns push_thirteen">
        <p>3 Col Push 13</p>
      </div>
      <div class="thirteen columns pull_three">
        <p>13 Columns Pull 3</p>
      </div>
    </div>
    <div class="row">
      <div class="four columns push_twelve">
        <p>4 Columns Push 12</p>
      </div>
      <div class="twelve columns pull_four">
        <p>12 Columns Pull 4</p>
      </div>
    </div>
    <div class="row">
      <div class="five columns push_eleven">
        <p>5 Columns Push 11</p>
      </div>
      <div class="eleven columns pull_five">
        <p>11 Columns Pull 5</p>
      </div>
    </div>
    <div class="row">
      <div class="six columns push_ten">
        <p>6 Columns Push 10</p>
      </div>
      <div class="ten columns pull_six">
        <p>10 Columns Pull 6</p>
      </div>
    </div>
    <div class="row">
      <div class="seven columns push_nine">
        <p>7 Columns Push 9</p>
      </div>
      <div class="nine columns pull_seven">
        <p>9 Columns Pull 7</p>
      </div>
    </div>
    <div class="row">
      <div class="eight columns push_eight">
        <p>8 Columns Push 8</p>
      </div>
      <div class="eight columns pull_eight">
        <p>8 Columns Pull 8</p>
      </div>
    </div>

    <!-- Centering tests -->
    <div class="row">
      <div class="sixteen columns special">
        <p>Centered Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="fifteen columns centered">
        <p>15 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="fourteen columns centered">
        <p>14 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="thirteen columns centered">
        <p>13 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="twelve columns centered">
        <p>12 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="eleven columns centered">
        <p>11 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="ten columns centered">
        <p>10 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="nine columns centered">
        <p>9 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="eight columns centered">
        <p>8 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="seven columns centered">
        <p>7 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="six columns centered">
        <p>6 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="five columns centered">
        <p>5 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="four columns centered">
        <p>4 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="three columns centered">
        <p>3 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="two columns centered">
        <p>2 Columns</p>
      </div>
    </div>

    <div class="row">
      <div class="one columns centered">
        <p>1 Col</p>
      </div>
    </div>

  </section>


  <!-- Grab Google CDN's jQuery, fall back to local if offline -->
  <!-- 2.0 for modern browsers, 1.10 for .oldie -->
  <script>
  var oldieCheck = Boolean(document.getElementsByTagName('html')[0].className.match(/\soldie\s/g));
  if(!oldieCheck) {
    document.write('<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"><\/script>');
  } else {
    document.write('<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"><\/script>');
  }
  </script>
  <script>
  if(!window.jQuery) {
    if(!oldieCheck) {
      document.write('<script src="js/libs/jquery-2.0.2.min.js"><\/script>');
    } else {
      document.write('<script src="js/libs/jquery-1.10.1.min.js"><\/script>');
    }
  }
  </script>

  <!--
  Include gumby.js followed by UI modules followed by gumby.init.js
  Or concatenate and minify into a single file -->
  <script gumby-touch="js/libs" src="js/libs/gumby.js"></script>
  <script src="js/libs/ui/gumby.retina.js"></script>
  <script src="js/libs/ui/gumby.fixed.js"></script>
  <script src="js/libs/ui/gumby.skiplink.js"></script>
  <script src="js/libs/ui/gumby.toggleswitch.js"></script>
  <script src="js/libs/ui/gumby.checkbox.js"></script>
  <script src="js/libs/ui/gumby.radiobtn.js"></script>
  <script src="js/libs/ui/gumby.tabs.js"></script>
  <script src="js/libs/ui/gumby.navbar.js"></script>
  <script src="js/libs/ui/jquery.validation.js"></script>
  <script src="js/libs/gumby.init.js"></script>

  <!--
  gumby.min.js contains gumby.js, all UI modules and gumby.init.js
  <script src="js/libs/gumby.min.js"></script> -->
  <script src="js/plugins.js"></script>
  <script src="js/main.js"></script>

  <!-- Change UA-XXXXX-X to be your site's ID -->
  <!--<script>
  window._gaq = [['_setAccount','UAXXXXXXXX1'],['_trackPageview'],['_trackPageLoadTime']];
  Modernizr.load({
    load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
  });
  </script>-->

  <!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to support IE 6.
     chromium.org/developers/how-tos/chrome-frame-getting-started -->
  <!--[if lt IE 7 ]>
  <script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
  <script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
  <![endif]-->

  </body>
</html>
